<template>
    <div class="wrap">
        <div class="live">
             <img :src="img">
                <p>
                    <span>预告</span>
                    <span>{{make}}</span>
                </p>    
                <h2>
                    {{title}}
                </h2>
        </div>

    </div>
</template>

<script>
export default {
    props:["title","make","img"]
    
}
</script>

<style scoped>
.wrap{
    display: flex;
}
.live{
    position: relative;
    color: white;
    margin-top: 0.15rem;
    margin-left: 0.1rem;
}
.live p,h2{
    position: absolute;
    
}
.live p{
    top: 0.05rem;
    font-weight: normal;
    font-size: 0.12rem;
}
.live p span{
    margin-left: 0.1rem;
}
.live p span:nth-of-type(2){
    background-color: rgba(46, 85, 121,0.2);
    padding: 0.02rem;
}
.live h2{
    bottom: 0.1rem;
    margin-left: 0.1rem;
}
.live img {
    width: 1.67rem;
    height: 1.2rem;
}
</style>